<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title></title>
	<style type="text/css">
		.head{
			background: #00a0d8;
			/*text-align文字，图片水平居中*/
			text-align: center;
			height: 106Px;
		}
		fieldset{
			width: 980px;
			margin:0 auto;
			/*只保留上边框*/
			border:0;
			border-top:1px solid #ddd;
		}
		legend{
			text-align: center;
			font-size:46px;
			/*线条和文字的距离*/
			padding:0 24px;
		}

		form{
			/*border:1px solid red;*/
			height: 400px;
			width:400px;
			margin:0 auto;
		}
		input{
			width:380px;
			height: 28px;
			font-size: 12px;
			padding: 4px 12px;
			border:1px solid #ddd;
			/*轮廓*/
			outline: none;
			/*圆角*/
			border-radius: 4px;
		}
		p{
			padding: 10px 0;

		}
		.a1{
			text-align: center;

		}

	</style>
</head>
<body>
	<!-- 1 图片 -->
	<div class="head">
		<img src="head.png">
	</div>
	<!-- 2.注册  -->
	<fieldset>
		<legend>登录</legend>
	</fieldset>
	<!-- 3.表单 -->
	<form>
		<div class=".a1"></div>
		</p>
		<p>
			<input type="" name="" placeholder="你的手机号/邮箱">
		</p>
		<p>
			<input type="password" name="" placeholder="密码">
		</p>
		<p style="font-size:10px;">
			<!-- style属性，所有标签都有style属性，在这个属性里可以写CSS -->
			<input type="checkbox" name="" style="width: 10px;height: 10px;background: blue;">记住我 不是自己的电脑上不要勾选选项
		</p>
		<p style="padding-right:20px;">
			<input type="" name="" placeholder="登录" style="background: #00a1d6;width: 140px;height: 30px;text-align: center;">

			<input type="" name="" placeholder="注册" style="width: 140px;height: 30px;text-align: center;">
		<p>
		</p>
	</form>
</body>
</html>